<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<link rel="stylesheet" href="/css/book.css">
	</head>
	<body>
		<div class="header">
			<a id="loginout" href="/loginout">退出登录</a>
			<div class="navheader"></div>
			<div class="nav">
				<div class="navList">
					
					<div <% if(cid==0) { %> class="active link" <% } else { %> class="link" <% } %>><a href="/">首页</a></div>

					<% for(let i=0;i<cataorys.length;i++){ %>
						<div <% if(cid==(i+1)) { %> class="active link" <% } else { %> class="link" <% } %>><a href="/category/<%=cataorys[i].id%>/page/1"><%=cataorys[i].category%></a></div>
			
					<%}%>
					
					<div class="search">
						<input type="text" id="search">
						<button class="searchBtn"><span class="icon"></span><span class="text">搜索</span></button>
					</div>
				</div>
			</div>
		</div>
		<div class="contentMain">
			<div class="content">
				<div class="bookList">
					<% for(let i=0;i<books.length;i++){ %>
						<a href="/book/info/<%-books[i].id%>">
							<div class="bookItem">
								<img class="bookImg" src="<%-books[i].bookimg%>" >
								<h3 class="title"><%-books[i].bookname%></h3>
								<p class="author"><%-books[i].author%></p>
								<div class="cataory"><%-books[i].cataory%></div>
							</div>
						</a>
					<%}%>
					
				</div>
				<div class="erweima">
					<img src="/img/2043.png" ><br/>
					<img src="/img/2116.png" >
				</div>
			</div>
			<div class="fenpage">
				<div class="pageBtns">
					<% if(page>1){ %>
						<a <% if(searchInfo==0) { %> href="/category/<%=cid%>/page/<%=(page-1)%>" <% } else { %> href="/category/0/search/<%=searchInfo%>/page/<%=(page-1)%>" <% } %> >上一页</a>
						
						<!-- <a href="/category/<%=cid%>/page/<%=(page-1)%>">上一页</a> -->
					<% } %>

					<% for(let i = startPage;i<=endPage;i++){ %>
						<!-- <a <% if(page==i){ %> class="active" <%}%>  href="/category/<%=cid%>/page/<%=i%>"><%=i%></a> -->
						<a <% if(page==i){ %> class="active" <%}%> <% if(searchInfo==0){ %> href="/category/<%=cid%>/page/<%=i%>" <% }else{ %> href="/category/0/search/<%=searchInfo%>/page/<%=i%>"  <% } %>><%=i%></a>
					<%}%>

					<% if(page<pageAll){ %>
						<a <% if(searchInfo==0) { %> href="/category/<%=cid%>/page/<%=(page+1)%>" <% } else { %> href="/category/0/search/<%=searchInfo%>/page/<%=(page+1)%>" <% } %> >下一页</a>
						<!-- <a href="/category/<%=cid%>/page/<%=(page+1)%>">下一页</a> -->
					<% } %>
				</div>
				<div class="allConut">共<%=pageAll%>页</div>


			</div>
		</div>
	
	<script>		
		var searchBtn = document.querySelector(".searchBtn");
		searchBtn.onclick = function(e){
			let value = document.querySelector("#search").value;
			if(value){
				location.href="/category/0/search/"+value+"/page/1";
			}else{
				location.href = "/category/0/page/1";
			}
			
		}
	</script>
	</body>
</html>
